<!--<model :show="flag" @close="()=>flag=false"></model>-->
<template id="model" >
  <div class="notes" v-show="show" >
    <div class="notes_bg"></div>
    <div class="notes_con">
      <h3>投保须知</h3>
      <p>
        1、被保险人必须为车辆实际使用人（满10周岁以上）。
        2、被保险人真实姓名需要与身份证号码保持一致。理赔时需要提供被保险人身份证复印件，请确保填写的被保险人真实姓名、身份证号码与身份证信息一致，否则将无法
        进行理赔。
        3、非常重要：请确保您的所有信息准确无误，保险信息一旦提交，将不可修改和补录。
        4、若被保险人已就本车型投过本保险且仍在保期内，则无法重复投保。
        5、保险公司将通过您填写的手机号发送有关保单号等信息，请确保手机号正确无误。
      </p>
      <div class="gotit" @click="gotit()">我知道了</div>
    </div>
  </div>
</template>
<script>
  let model = {
      props:['show'],  //接收了父组件得属性
      template:"#model",
      methods:{
        gotit(){
          this.$emit('close')
        }
      }
  };
  export default {
    data(){
      return {}
    },
    methods: {},
    computed: {},
    components: {
      model
    }
  }
</script>
<style scoped lang="less">
  .notes {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
  }

  .notes_bg {
    width: 100%;
    height: 100%;
    background-color: #000;
    opacity: .4;
  }

  .notes_con {
    width: 96%;
    left: 2%;
    position: absolute;
    bottom: 8px;
    background-color: #f7f7f7;
    border-radius: 10px;
    overflow: hidden;
    padding-top: 17px;

    h3 {
      line-height: 50px;
      text-align: center;
    }
    p {
      line-height: 30px;
      width: auto;
      padding: 0 43px;
      color: #7b7b7b;
    }
    .gotit {
      line-height: 60px;
      border-top: 1px solid #e1e1e1;
      font-size: 15px;
      text-align: center;
      font-weight: bold;
      background-color: #f2f2f2;
    }
  }


</style>
